<template>
	<view class="content">
		<u-navbar
		          title="选择院区"
		          :autoBack="true"
		      >
		      </u-navbar>
		<view class="box" v-for="v in addList" :key="v.hospitalId" @click="selectHosp(v)">
			<view class="list " :class="{select : v.hospitalId == currentHospitalId}">
				<view class="title">{{v.plat_hospital_name}}</view>
				<view class="address">
					<view class="icon">
						<u--image :showLoading="true" :src="local" width="8px" height="10px"></u--image>
					</view>
					<view class="text">{{v.address}}</view>
				</view>
			</view>
			<view class="sel" v-if=" v.hospitalId == currentHospitalId">
				<u--image :showLoading="true" :src="boxSelect" width="44rpx" height="44rpx"></u--image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				local: require('@/static/icons/local.png'),
				boxSelect: require('@/static/icons/box_select.png'),
				currentHospitalId: ''
			};
		},
		methods: {
			selectHosp(params) {
				this.currentHospitalId = params.hospitalId
				this.$store.state.doc.currentHosp = params
				//console.log(this.currentHospitalId, this.$store.state.doc.currentHosp);
				uni.navigateTo({
					url: '/pages/sousuo/search_hosp_details/index'
				})
				// uni.navigateBack({
				// 	delta: 1
				// });
			},

		},
		computed: {
			addList() {
				let arr = []
				arr.push(this.$store.state.doc.addList.main, ...this.$store.state.doc.addList.branch)
				//console.log(arr);
				return arr
			}
		},
		mounted() {
			this.currentHospitalId = this.$store.state.doc.currentHosp.hospitalId
		},
		onShow() {
			// my.setNavigationBar({
			// 	title: '切换院区',
			// })
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		padding-top: 30rpx;
		padding-bottom: 80rpx;
		background: #F5F6F8;
		padding-top: 180rpx;

		.box {
			position: relative;
			margin: 0 30rpx;

			.list {
				display: flex;
				flex-direction: column;
				padding: 22rpx 0 22rpx 30rpx;
				background: #FFFFFF;
				border-radius: 10rpx;
				margin-top: 30rpx;

				.title {
					font-size: 28rpx;
					font-weight: 600;
					color: #333333;
					line-height: 40rpx;
				}

				.address {
					font-size: 24rpx;
					font-weight: 400;
					color: #666666;
					line-height: 34rpx;
					display: flex;
					align-items: center;
					margin-top: 16rpx;

					.icon {}

					.text {
						margin-left: 10rpx;
					}
				}
			}

			.select {
				border: 1px solid #4581F6;
			}

			.sel {
				position: absolute;
				top: 0;
				right: 0;
			}
		}

	}
</style>